<!DOCTYPE html>
<html lang="zh-CN">
<head>
	<meta charset="utf-8" />
	<meta name="viewport" content="width=device-width, initial-scale=1" />
	<meta name="renderer" content="webkit" />
	<link href="../css/bootstrap.min.css" rel="stylesheet" />
	<link href="../css/font-awesome.min.css" rel="stylesheet" />
	<link href="../css/animate.css" rel="stylesheet" />
	<link href="../css/style.css" rel="stylesheet" />
	<link href="../css/plugins/toastr/toastr.min.css" rel="stylesheet">
	
</head>
<body class="top-navigation">
	<div id="wrapper">
		<div id="page-wrapper" class="gray-bg dashbard-1">
			<div class="row border-bottom">
<nav class="navbar navbar-static-top" data-role="navigation">
<!-- 以下是顶部导航栏，需要根据页面配置 -->
					<div class="navbar-header">
						<div class="minimalize-styl-2">
						
<!-- 请确保下面的<a>标签中的href属性地址和相对路径一致 -->
							<a class="btn btn-success" title="返回主页" href="main.html"><i class="fa fa-lg fa-home"></i></a>
<!-- 请确保上面的<a>标签中的href属性地址和相对路径一致 -->

							<a class="back-link btn btn-success" title="后退"><i class="fa fa-lg fa-arrow-left"></i></a>
							<a class="reload-link btn btn-success" title="重新加载"><i class="fa fa-lg fa-repeat"></i></a>

<!-- 以下是指示页面上下文的部分，需要根据实际路径修改 -->
							<ol id="guide" class="breadcrumb m-l">
<!-- <li><a>上级页面的上级页面</a><li> -->
<!-- <li><a>上级页面</a><li> -->
<!-- <li><strong>当前页面</strong><li> -->
								<li><strong>主页</strong></li>
							</ol>
<!-- 以上是指示页面上下文的部分，需要根据实际路径修改 -->

						</div>
					</div>
					<div class="nav navbar-top-links navbar-right minimalize-styl-2">
						<span class="m-r-sm text-muted welcome-message btn btn-link">欢迎使用Feces物流管理系统</span>
					</div>
<!-- 以上是顶部导航栏，需要根据页面配置 -->
				</nav>
			</div>
			
			
			
			
			<!-- 配置点2 -->
			<!-- 内容 -->
			<div class="wrapper wrapper-content animated fadeInRight">
			
			
			
			
				<!-- 配置点2.1 -->
				<!-- 段落1 -->
				<div class="row">
					<div class="col-lg-12">
						<div class="ibox float-e-margins">
							<div class="ibox-title">
								<h5>查询客户信息</h5>
							</div>
							<div class="ibox-content">
     
				<table class="table table-striped table-bordered table-hover ">
				<tr><td>姓名：</td>
				<td>
					<input type="text" class="sub-info" id="sub_name" placeholder="请输入姓名" required="">
				</td></tr>
				<tr><td>移动电话：</td>
				<td>
					<input type="text" class="sub-info" id="sub_mphone"  placeholder="请输入移动电话" required="">
				</td></tr>
				<tr><td>身份证号：</td>
				<td>
					<input type="text" class="sub-info" id="sub_id_card" placeholder="请输入身份证号" required="">
				</td></tr>
				</table>
				<button type="button" onclick="fnClickAddRow();" class="btn btn-success block full-width m-b">查询</button>
								<!-- 配置点2.2 -->
				<!-- 段落2 -->
				<div class="row">
					<div class="col-lg-12">
						<div class="ibox float-e-margins">
							<div class="ibox-title">
								<h5>查询结果</h5>
							</div>
							<div class="ibox-content">
							<table class="table table-striped table-bordered table-hover "
								id="editable">
								
								
							<thead>
								<tr>
										<th>客户编号</th>
										<th>客户姓名</th>
										<th>单位名称</th>
										<th>座机</th>
										<th>移动电话</th>
										<th>身份证号</th>
										<th>操作1</th>
										<th>操作2</th>
										<th>操作3</th>
								</tr>
							</thead>

								<tfoot>
									<tr>
										<th></th>
										<th></th>
										<th></th>
										<th></th>
										<th></th>
										<th></th>
										<th></th>
										<th></th>
										<th></th>
									</tr>
								</tfoot>
							</table>
		

							</div>
						</div>
					</div>
				</div>
							</div>
						</div>
					</div>
				</div>
			</div>
		</div>
	</div>
	
	
	<script src="../js/jquery-2.1.1.min.js"></script>
	<script src="../js/bootstrap.min.js"></script>
	<script src="../js/plugins/metisMenu/jquery.metisMenu.js"></script>
	<script src="../js/plugins/slimscroll/jquery.slimscroll.min.js"></script>
	<script src="../js/feces.js"></script>
	<script src="../js/plugins/pace/pace.min.js"></script>
	<script src="../js/plugins/toastr/toastr.min.js"></script>
	<!-- Data Tables -->
	<script src="../js/plugins/dataTables/jquery.dataTables.js"></script>
	<script src="../js/plugins/dataTables/dataTables.bootstrap.js"></script>
	
	
	
	<!-- 配置点3 -->
	<!-- 载入后的js脚本 -->
	<script>
	$(function(){
		// you JavaScript code here!
	});
		var url = "../api/cl";
		$(document).ready(function() {
			$('.dataTables-example').dataTable();

			/* Init DataTables */
			var oTable = $('#editable').dataTable();

			/* Apply the jEditable handlers to the table */
			oTable.$('td').editable('../example_ajax.php', {
				"callback" : function(sValue, y) {
					var aPos = oTable.fnGetPosition(this);
					oTable.fnUpdate(sValue, aPos[0], aPos[1]);
				},
				"submitdata" : function(value, settings) {
					return {
						"row_id" : this.parentNode.getAttribute('id'),
						"column" : oTable.fnGetPosition(this)[2]
					};
				},

				"width" : "90%",
				"height" : "100%"
			});

		});
		var cll;
		var cl;
		function fnClickAddRow() {
		var name=$("#sub_name").val();
		var mp=$("#sub_mphone").val();
		var idc=$("#sub_id_card").val();
		$.ajax({
			type: "GET",
			url: url,
			data: {
				name    : name,
				mphone  : mp,
				id_card : idc
			},
			success: function(result){

			var rs = result.data;
			 cll=rs;
			var lg=cll.length;
			for(var i=0;i<lg;i++)
			{
				cl=cll[i];
				$('#editable').dataTable()
					.fnAddData(
						[ cl.id, 
						  cl.name,
						  cl.bu,
						  cl.phone,
						  cl.mphone, 
						  cl.id_card,
						  "<a onclick='make_order("
								  +i
								  +")'>客户详细信息</a",
						  "<a id=\"del_cli"+cl.id+"\" onclick=\"del("+cl.id+")\">用户删除</a>",
						  "<a id=\"del_cli"+cl.id+"\" onclick=\"update("+cl.id+")\">用户信息修改</a>"]);
				}
			}
			
			});
			

		}
		function update(index)
		{
			location.href="hwz_client_info_update.jsp?id="+index;
		}
		function make_order(index)
		{
			location.href="../api/ordercli?order_client="+cll[index].id;
		}
		function del(id)
		{
			var url1="api/cl";
			$.ajax(
			{	
				type: "DELETE",
				url: url1,
				data: {
					id:id
				},
				success: function()
				{
					alert("success");
				}
			}
			);
			$("#del_cli"+id).parent().parent().remove();
			
		}
	</script>
	
	
	
	</body>
</html>
